<template>
	<view class="warp">
		<button type="primary" @click="onClick" style="margin-bottom: 20px;" size="mini">获取数据</button>
		<view class="box">
			<view class="title">默认效果</view>
			<t-table @change="change">
				<t-tr>
					<t-th>城市</t-th>
					<t-th>温度</t-th>
					<t-th>天气</t-th>
					<t-th>风向</t-th>
				</t-tr>
				<t-tr v-for="item in tableList" :key="item.id">
					<t-td>{{item.city}}</t-td>
					<t-td>{{item.temperature}}</t-td>
					<t-td>{{item.weather}}</t-td>
					<t-td>{{item.winddirection}}</t-td>
				</t-tr>
			</t-table>
		</view>
		
	</view>
</template>

<script>
	import tTable from '@/components/t-table/t-table.vue'
	import tTh from '@/components/t-table/t-th.vue'
	import tTr from '@/components/t-table/t-tr.vue'
	import tTd from '@/components/t-table/t-td.vue'
	export default {
		components: {
			tTable,
			tTh,
			tTr,
			tTd
		},
		data() {
			return {
				tableList: []
			}
		},
		onLoad() {

		},
		methods: {
			change (e) {		
				console.log(e.detail)
			},
			onClick () {
				console.log('我被点击了')
				this.$fly.get('/weather/weatherInfo', {
					'city': '610100'
				}).then((res) => {
					console.log(res)
					this.tableList = res.lives
				})
			}
		}
	}
</script>

<style>
	.warp {
		margin-top: 100rpx;
		margin-left: 10px;
		margin-right: 10px;
		margin-bottom: auto;
	}
</style>
